<template>
  <div class="bg-white rounded-lg p-5 h-full">
    <div class="font-bold text-lg mb-4">添加记分</div>
    <el-form :model="editForm" ref="form" label-width="120px" :rules="rules">
      <el-form-item label="记分医疗机构" prop="creditCode">
        <el-select
          v-model="editForm.creditCode"
          filterable
          remote
          @change="onHospitalChange"
          reserve-keyword
          placeholder="输入医疗机构名称搜索"
          :remote-method="remoteMethod"
        >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="选择医师" prop="identityNumber">
        <el-select
          :disabled="!editForm.enterpriseName"
          v-model="editForm.identityNumber"
          filterable
          remote
          @change="onDoctorChange"
          reserve-keyword
          placeholder="输入医师名称搜索"
          :remote-method="remoteDoctorMethod"
        >
          <el-option
            v-for="item in doctorOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="记分类型" prop="reason">

        <el-select
          v-model="editForm.reason"
          filterable
          remote
          @change="onReasonChange"
          reserve-keyword
          placeholder="请选择记分类型"

        >
          <el-option
            v-for="item in reasonList"
            :key="item.id"
            :label="item.reason"
            :value="item.reason"
          >
          </el-option>
        </el-select>
        <el-button @click="toTypeListPage" type="primary"
        >查看记分类型表</el-button
        >
      </el-form-item>
<!--      <el-form-item label="记分类型" prop="reason">
        <el-input
          style="width: 200px"
          class="mr-4"
          v-model="editForm.reason"
          placeholder="请选择记分类型"
        />
        <el-button @click="toTypeListPage" type="primary"
          >查看记分类型表</el-button
        >
      </el-form-item>-->
    </el-form>
    <hr class="my-4" />
    <div class="flex">
      <el-button @click="submit" type="primary">确认</el-button>

      <el-button @click="goBack">返回</el-button>
    </div>
  </div>
</template>

<script>
import { getHospitalListAPI } from "@/api/zhangping/health-care/base-info";
import {
  getDoctorByHospitalAPI,
  addDoctorScoringAPI,
} from "@/api/zhangping/health-care/doctor-scoring";
import { listTypePullDown } from '@/api/zhangping/health-care/org-scoring'
export default {
  name: "Doctor-scoring-edit",
  data() {
    return {
      loading: false,
      options: [],
      doctorOptions: [],
      reasonList:[],
      editForm: {
        creditCode: null,
        reason: null,
        scoring: null,
        physicianName: null,
        identityNumber: null,
        enterpriseName: null,
      },

      rules: {
        physicianName: [
          { required: true, message: "请选择医师", trigger: "blur" },
        ],
        creditCode: [
          { required: true, message: "请选择医疗机构", trigger: "blur" },
        ],
        reason: [
          { required: true, message: "请选择记分类型", trigger: "blur" },
        ],
      },
    };
  },
  mounted() {
    this.getHospitalList();
    this.getReasonList();
    const { name } = this.$route;
    if (name) {
      this.$store.dispatch("tagsView/addView", this.$route);
    }
  },

  activated() {
    const { reason, score } = this.$route.query;

    if (reason && score) {
      this.editForm.reason = reason;
      this.editForm.scoring = score;
      this.$refs.form.validateField("reason");
    }
  },

  methods: {
    onHospitalChange(value) {
      this.options.find((item) => {
        if (item.value === value) {
          this.editForm.enterpriseName = item.label;
        }
      });
      this.$refs.form.validateField("creditCode");
      this.getDoctorList();
    },
    onDoctorChange(value) {
      this.doctorOptions.find((item) => {
        if (item.value === value) {
          this.editForm.physicianName = item.label;
        }
      });
      this.$refs.form.validateField("identityNumber");
    },
    getDoctorList(name) {
      const params = {
        creditCode: this.editForm.creditCode,
        pageNum: 1,
        pageSize: 1000,
        physicianName: name,
      };
      getDoctorByHospitalAPI(params).then((res) => {
        const { code, data } = res;
        if (code === 200) {
          this.doctorOptions = data.map((item) => {
            return {
              label: item.physicianName,
              value: item.identityNumber,
            };
          });
        }
      });
    },
    remoteDoctorMethod(query) {
      this.getDoctorList(query);
    },
    remoteMethod(query) {
      this.getHospitalList(query);
    },
    getHospitalList(name) {
      const params = {
        pageNum: 1,
        pageSize: 1000,
        enterpriseName: name,
      };
      getHospitalListAPI(params).then((res) => {
        const { code, rows } = res;
        console.log(res);
        if (code !== 200) {
          this.$message.error("获取医疗机构列表失败");
          return;
        }

        this.options = rows.map((item) => {
          return {
            label: item.enterpriseName,
            value: item.creditCode,
          };
        });
      });
    },

    toTypeListPage() {
      this.$store.commit("SET_RECORD_TYPE", 1);
      this.$router.push({ path: "/health-care/org-scoring-type" });
    },
    goBack() {
      const { name } = this.$route;
      if (name) {
        this.$store.dispatch("tagsView/delView", this.$route);
      }
      this.$router.push({ path: "/health-care/doctor-scoring-record" });
    },
    // 确认
    submit() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          console.log(this.editForm);
          addDoctorScoringAPI(this.editForm).then((res) => {
            const { code, data } = res;
            if (code === 200) {
              this.$message.success("添加记分成功");
              this.goBack();
              return;
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    onReasonChange(value) {
      this.reasonList.find((item) => {
        if (item.reason === value) {
          this.editForm.reason = item.reason;
          this.editForm.scoring = item.score;
        }
      });
      this.$refs.form.validateField("reason");
    },
    getReasonList() {
      listTypePullDown(1).then((res) => {
        this.reasonList = res.data;
      })
    },
  },
};
</script>

<style scoped="scoped" lang="scss"></style>
